<!DOCTYPE html>
<html>
<head>
	<title>{$site_name}</title>
	<meta charset="utf-8">
	<meta name="renderer" content="webkit"/>
    <meta name="force-rendering" content="webkit"/>
    <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/>
    <script>/*@cc_on window.location.href="{:url('index/index/browser')}" @*/</script>

	<script type="text/javascript" src="{:_static()}/js/polyfill.min.js"></script>
	<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
	<script src="https://cdn.bootcss.com/vue/2.5.16/vue.min.js"></script>
	{block name="style"}
	<!-- 这里允许在引入一些样式头部 -->
	{/block}
	<!-- 引入样式 -->
	<link rel="stylesheet" href="https://cdn.staticfile.org/element-ui/2.4.2/theme-chalk/index.css">
	<!-- 引入组件库 -->
	<script src="https://cdn.staticfile.org/element-ui/2.4.2/index.js"></script>
	<script src="https://cdn.jsdelivr.net/npm/tween.js@16.3.4"></script>
	<link rel="stylesheet" href="{:_static()}/css/style.css">
	<script type="text/babel" src="{:_static()}/js/mixins.js"></script>
	<script src="https://cdn.bootcss.com/socket.io/2.0.4/socket.io.js"></script>
</head>
<body>
<div id="app" v-cloak>
	<el-row class="ws-quote">
		<span>当前调试机： {{device.name}}</span><span style="padding-left: 40px;">ID： {{device.id}}</span>
	</el-row>
	<el-row class="ws-quote">
		<el-button type="primary" size="small" @click="finishTask">完成任务</el-button>
	</el-row>
	<el-row class="p_y20" v-if="task">
		<el-col :span="24" class="p_y20">{{task.title}}</el-col>
		<el-col :span="24">{{task}}</el-col>
	</el-row>
	<el-row class="p_y20" v-if="result">
		<el-col :span="24" class="p_y20">回馈结果</el-col>
		<el-col :span="24">{{result}}</el-col>
	</el-row>
</div>


<script type="text/babel" type="text/javascript">
window.socket = io("{:config('setting.socket_host')}");	
//window.socket2 = io("{:config('setting.socket_host2')}");	
var app=new Vue({
	el:"#app",
	mixins:[wsMixins],
	data:{
		nav:{$_nav|stripslashes|raw}, 
		connected:false,
		device:{$device|raw},
		token:"{$token}",

		task:null,
		result:null,
		count:0,
		hasTask:false,
	},
	created(){
		this.init();
		
	},
	watch:{
		
	},
	methods:{
		init(){
			if(socket){
				socket.on('reconnect_error',err=>{
					// 重连失败 
					this.$notify({
			          	title: '提示信息',
			          	message: '连接失败，请确保您的Socket服务已经开启，并刷新页面即可!',
			          	type: 'warning'
			        });
				  	socket.close();
				});
				socket.on('connect',_=>{
					// 连接成功
					this.connected=socket.connected;
					socket.emit('login',{id:"{$user.id}",login_name:"{$user.login_name}",device_id:this.device.id});
					this.start(); //首次载入任务
					
				});
				// socket2.on('connect',_=>{
				// 	// 连接成功
				// 	socket2.emit('login',{id:"{$user.id}",login_name:"{$user.login_name}",device_id:this.device.id});
					
				// });
				// socket2.on('getScreen',data=>{
				// 	console.log('服务器请求画面传输...')
				// });
				// 接收到新任务指令
				// 朋友圈
				socket.on('friends',data=>{
					this.newTask(data);
				});
				// 群发信息
				socket.on('messages',data=>{
					console.log(data)
					this.newTask(data);
				});
				// 添加好友
				socket.on('addFriends',data=>{
					this.newTask(data);
				});
				// 编辑设置
				socket.on('settings',data=>{
					this.newTask(data);
				});
				// 扩展任务
				socket.on('extraTask',data=>{
					this.newTask(data);
				});
				// 微信消息任务
				socket.on('wxMsg',data=>{
				    this.newTask(data);
				})
			}

		},
		newTask(data){
			console.log('新任务：',data);
			this.task=data;
			this.count++;
			this.hasTask=true;
		},
		finishTask(){
			let task=this.task,
				data={device_id:this.device.id,token:this.token};
			if(task&&task.event==='extraTask'){
				if(task.action===3){
					data.cate='wxMsgInfos';
				}
			}
			this.task=null;
			$.post("{:url('api/task/finish')}",data,res=>{
				if(typeof res==='string'){
					res=JSON.parse(res);
				}
				console.log(res);
				this.result=res;
			});
		},
		start(){
			$.post("{:url('api/task/start')}",{device_id:this.device.id,token:this.token},res=>{
				if(typeof res==='string'){
					res=JSON.parse(res);
				}
				console.log('start.....');
			});
		},
	}
});
</script>
<script type="text/javascript" src="{:_static()}/js/browser.min.js"></script>
</body>
</html>
